import { ref, reactive } from 'vue'
import { Role, setCurrentRole } from './permission'
import axios from 'axios'
import { ElMessage } from 'element-plus'

// 用户信息接口
export interface UserInfo {
  id: string
  username: string
  role: Role
  avatar?: string
  email?: string
  tel?: string // 电话字段，根据后端要求添加
}

// 用户状态
const userInfo = reactive<UserInfo>({
  id: '',
  username: '',
  role: Role.USER
})

// 登录状态
const isLoggedIn = ref(false)

// 初始化用户状态
export const initUserState = () => {
  // 从本地存储中获取用户信息
  const storedUser = localStorage.getItem('user')
  if (storedUser) {
    try {
      const parsedUser = JSON.parse(storedUser)
      // 防御：若存储里没有角色或异常，降级为普通用户
      Object.assign(userInfo, { ...parsedUser, role: parsedUser.role || Role.USER })
      setCurrentRole(userInfo.role)
      isLoggedIn.value = true
    } catch (e) {
      console.error('Failed to parse user info:', e)
      clearUserState()
    }
  }
}

// 设置用户信息
export const setUserInfo = (user: UserInfo) => {
  // 防御：无角色时降级为 USER
  const safeUser = { ...user, role: user.role || Role.USER }
  Object.assign(userInfo, safeUser)
  setCurrentRole(userInfo.role)
  isLoggedIn.value = true
  
  // 保存到本地存储
  localStorage.setItem('user', JSON.stringify(userInfo))
}

// 清除用户状态
export const clearUserState = () => {
  Object.assign(userInfo, {
    id: '',
    username: '',
    role: Role.USER
  })
  setCurrentRole(Role.USER)
  isLoggedIn.value = false

  // 清除本地存储
  localStorage.removeItem('user')
  localStorage.removeItem('token') // 建议加上
}

// 更新用户角色
export const updateUserRole = (role: Role) => {
  userInfo.role = role || Role.USER
  setCurrentRole(userInfo.role)
  
  // 更新本地存储
  localStorage.setItem('user', JSON.stringify(userInfo))
}

// 从后端获取用户信息
export const fetchUserInfo = async () => {
  const token = localStorage.getItem('token')
  if (!token) {
    return false
  }
  
  try {
    // 调用获取用户信息的接口
    const response = await axios.get('/me', {
      headers: {
        Authorization: `Bearer ${token}`
      }
    })
    
    if (response.data.code === 200 && response.data.data) {
      const apiRole: Role = response.data.data.role || Role.USER
      // 设置用户信息（没有角色一律按 USER）
      setUserInfo({
        id: response.data.data.userId,
        username: response.data.data.username,
        role: apiRole,
        avatar: response.data.data.avatar,
        email: response.data.data.email,
        tel: response.data.data.tel // 从后端获取电话字段
      })
      return true
    } else {
      ElMessage.error(response.data.msg || '获取用户信息失败')
      return false
    }
  } catch (error) {
    console.error('获取用户信息失败:', error)
    
    // 清除用户状态，因为token可能已失效
    clearUserState()
    return false
  }
}

export { userInfo, isLoggedIn }